@import url(../css/command.css);
@import url(../css/rest.css);
@import url(../utils/iconfont.css);

// 整体
.warp{
    width: 100vw;
    // 头部
    header{
        width: 93.3333vw;
        height: 17.3333vw;
        margin: 0 3.3333vw;
        display: flex;
        justify-content: space-between;
        align-items: center;
        // 返回按钮
        .back_btn{
            display: block;
            width: 16.4vw;
            height: 7.6vw;
            background-color: #fff;
            border: 0.1333vw solid #ff9344;
            border-radius: 2.8vw;
            a{
                font-size: 3.4667vmin;
                color: #000;
            }
        }
        // 头部页面标题
        .head_name{
          font-size: 3.4667vmin; 
          line-height: 7.6vw; 
        }
        // 收藏按钮
        .Collection_btn{
               width: 7.6vw;
               height: 7.6vw;
               text-align: center;
               background-color: transparent;
               border: 0;
            .shoucang{
               font-size: 6.6667vw;
               color: #ff9344;
            }
        }
    }
    // 主体内容
    main{
        width: 93.3333vw;
        margin: 0 3.3333vw;
        // 食物背景图
        .food_bg{
          width: 93.3333vw;
          img{
            display: block;
            width: 100%;
          }
        }
        // 食物详细介绍
        .food_info_cnt{
            width: 93.3333vw;
            margin:4vw 0;
            // 购买、价格栏
            .pice_buy{
                width: 88.5333vw;
                display: flex;
                justify-content: space-between;
                margin: 0 3.0667vw;
                & span{
                   font-size: 9.6vmin;
                   color: #ff9344;
                }
                // 购买按钮
                button{
                    width: 14.6667vw;
                    height: 8vw;
                    background: #ff9344;
                    border: .1333vw solid #ff9344;
                    border-radius: 3vw;
                    a{
                        font-size: 4vmin;
                        color: #fff;
                    }
                }
            }
            // 客户评价
            .evaluate{
                width: 88.5333vw;
                display: flex;
                justify-content: space-between;
                margin: 0 3.0667vw;
                .evaluate_left{
                    width: 27.2vw;
                    height: 8.2667vw;
                    display: flex;
                    align-items: center;
                    .shoucang{
                      color: #ff9344;
                      font-size: 5.0667vmin;
                    }
                    & span:nth-of-type(1){
                         font-size: 4vmin;
                         color: #000;
                    }
                    & span:nth-of-type(2){
                        font-size: 4vmin;
                        color: #ff9344;
                   }
                }
                .evaluate_right{
                    width: 23vw;
                    height: 8.2667vw;
                   & span{
                        font-size: 3.4667vmin;
                        color: #8e8e8e;
                        line-height: 8.2667vw;
                    }
                }
            }
            // 适用商户
            .userfit{
                width: 88.5333vw;
                height: 8.9333vw;
                display: flex;
                justify-content: space-between;
                background-color: #ff9344;
                margin: 0 3.0667vw;
                 
                 & a{
                     span{
                        font-size: 4vmin;
                        color: #fff;
                        line-height: 8.9333vw;
                        margin: 1.6vw;
                     }
                  }
            }
        }
        // 门店列表
        .shoplist{
             width: 88.5333vw;
             margin: 0 3.0667vw;
             & .shop_box:last-child{
                margin-bottom: 13.6667vw;
             }
            //  单个门店样式
             .shop_box{
                width: 100%;
                display: flex;
                justify-content: space-between;
                align-items: center;
                // 左边区域
                .shopinfo_left{
                   width: 23.4667vw;
                   height: 23.4667vw;
                   position: relative;
                   img{
                    width: 23.4667vw;
                    display: block;
                   }
                   .shop_img_name{
                    width: 100%;
                    height: 5.2vw;
                    background-color: #fff;
                    opacity: 0.7;
                    text-align: center;
                    position: absolute;
                    bottom: 6.4vw;
                    left: 0;
                    font-size: 3.2vmin;
                    line-height: 5.2vw;
                   }

                }
                // 中间区域
                .shopinfo_mid{
                    display: flex;
                    flex-direction: column;
                    // justify-content: space-evenly;
                // 第一行文字，店名
                    p{
                        margin-top: 1.3333vw;
                    }
                    & p:nth-of-type(1){
                       font-size: 4vmin;
                    }
                    // 五星评分
                    & p:nth-of-type(2){
                      .stars{
                        font-size: 4.5333vmin;
                        color: #ff9344;
                        letter-spacing: -0.7vw;
                      }
                      span{
                        font-size: 3.4667vmin;
                      }
                    }
                    // 距离
                    & p:nth-of-type(3){
                        font-size: 3.2vmin;
                        color: #929292;
                    }
                    // 查看详情
                    & p:nth-of-type(4){
                        a{
                            font-size: 2.6667vmin;
                            color: #ff9344;
                            line-height: 2.6667vmin;
                        }
                    }
                }
                // 右边区域
                .shopinfo_right{

                    button{
                        width: 14.6667vw;
                        height: 8vw;
                        background: #ff9344;
                        border: .1333vw solid #ff9344;
                        border-radius: 3vw;
                        a{
                            color: #fff;
                            font-size: 4vmin;
                            line-height: 4vmin;
                        }
                    }
                }
             }
        }
        
    }
}